<template>
  <div v-if="aeVo">
    <Form ref="frontConfigForm" :model="aeVo" :rules="ruleValidate" :label-width="100">
      <FormItem label="食谱标题" prop="title">
        <Input v-model="aeVo.title" placeholder=""></Input>
      </FormItem>
      <FormItem label="食谱内容" prop="content">
        <summernote v-if="aeVo" v-model="aeVo.content"></summernote>
      </FormItem>
    </Form>
  </div>
</template>

<script type="text/ecmascript-6">
  import Vue from 'vue'
  import summernote from '../common/summernote';
  import {SERVICE_URLS} from "../../libs/service.url";

  export default {
    props: ['closeHandle', 'targetData'],
    components: {
      summernote
    },
    data() {
      return {
        aeVo: null,
        ruleValidate: {
          title: [
            {required: true, message: '食谱标题不能为空！', trigger: 'blur'}
          ],
          content: [
            {required: true, message: '食谱内容不能为空！', trigger: 'blur'}
          ]
        },
        bIsAdd: false
      }
    },
    created() {
      if (this.targetData) {
        this.bIsAdd = false;
        this.aeVo = Object.assign({},this.targetData);
      } else {
        this.bIsAdd = true;
        this.aeVo = {
          id : '',
          title : '',
          content : '',
          articleColumn : '每周食谱',
        }
      }
    },
    methods: {
      handleSubmit() {
        let self = this;
        this.$refs['frontConfigForm'].validate((valid) => {
          if (valid) {
            let url;
            if (self.bIsAdd) {
              url = SERVICE_URLS.article.add ;
            } else {
              url = SERVICE_URLS.article.edit;
            }
            Vue.submit(self, {
              loading: 'loading',
              url: url,
              data: self.aeVo,
              callback: (_data) => {
                self.$Message.success('操作成功!');
                if (self.closeHandle) {
                  self.closeHandle();
                }
              }
            })
          } else {

          }
        });
      },
      handleReset() {
        this.$refs['frontConfigForm'].resetFields();
      }
    }
  }
</script>

<style scoped lang="scss">

</style>
